<!--
 * @Author: xjt
 * @Date: 2021-06-24 23:29:47
 * @LastEditTime: 2021-07-03 20:44:30
 * @Description: 信息登记核实
 * @LastEditors: cqg
-->
<template>
  <basic-container v-loading="loading" element-loading-text="数据加载中...">
    <dataList
      placeholder="请输入姓名"
      searchName="name"
      :pageInfo="pager"
      :listData="tableData"
      :filterList="filterList"
      :selectData="selectDataArr"
      :menuList="['add']"
      @menu-click="handleMenuClick"
      :dataInfo="dataInfo"
      :operaInfo="operaInfo"
      @btn-click="handleBtnClick"
      operaColumnWidth="120"
      :openIndex="true"
    ></dataList>
    <previewReceiv ref="hotelDialog" />
    <previewReceiv ref="receiveDialog" />
    <adialog
      title="新增"
      width="600px"
      ref="dialog"
      :rules="addRules"
      @submit="addSubmit"
      :formItemList="popUpdata"
      @item-change="formItemChang"
    ></adialog>
  </basic-container>
</template>

<style lang="scss" scoped>
.operateMain {
  /deep/ .top-buttons {
    float: right;
    width: 50%;
  }
  /deep/ .v-search {
    width: 50%;
    justify-content: flex-start;
  }
  /deep/ .operaColumn .el-button {
    color: var(--color);
  }
}
</style>

<script>
import {
  getBookintoJspage,
  getListBatchAll,
  getHotelBaseById,
  getHotelBookById,
  putBookComplete,
  getHotelList,
  savePerson,
} from "@/views/yq-personnel/api/check";
import { getpagequery } from "@/views/yq-personnel/api/health.js";
import previewReceiv from "../components/previewReceiv.vue";
import adialog from "../module/addDialog";
import { extractName } from "@/utils/extract";
import { validatePhone, validateIdNo } from "~/utils/validate.js";
import { getDict } from "@/utils";

export default {
  components: {
    previewReceiv,
    adialog,
  },
  provide() {
    return {
      initList: this.queryData,
      personId: () => this.currentPersonId,
      moveInfoId: () => this.currentMoveInfoId,
      hotelBaseInfoId: () => this.currentHotelBaseInfoId,
    };
  },
  beforeCreate() {
    //获取预订批次
    // getListBatchAll({ isSelf: 1 }).then(res => {
    //   if (res.data.data) {
    //     this.filterList[0].children = res.data.data.map(a => ({ label: a.batchNum, value: a.batchNum }));
    //   }
    // })

    //获取人员类型字典
    this.personOption = getDict("person_classify").map((a) => ({
      label: a.label,
      value: a.value,
    }));
  },

  beforeMount() {
    this.queryData();
  },

  data() {
    return {
      popUpdata: [
        { label: "姓名", prop: "name", type: "input", class: "full" },
        {
          label: "证件类型",
          prop: "cardType",
          type: "select",
          options: getDict("card_type"),
          class: "full",
        },
        {
          label: "证件号码",
          prop: "cardId",
          key: "cardId",
          type: "input",
          class: "full",
        },
        {
          label: "人员类型",
          prop: "personClassify",
          key: "personClassify",
          type: "select",
          class: "full",
          options: this.personOption,
          change: true,
        },
        {
          label: "手机号",
          prop: "telPhone",
          key: "telPhone",
          type: "input",
          class: "full",
        },
      ],
      // 表格列表数据
      tableData: [],
      currentMoveInfoId: "",
      currentPersonId: "",
      currentHotelBaseInfoId: "",
      personOption: [],
      // 请求参数
      params: {
        current: 1,
        size: 20,
        keyword: "",
      },
      querys: {
        current: 1,
        size: 100,
      },
      // 选中的数据
      selectDataArr: [],
      // 分页
      pager: {
        total: 0, // 总页数
        current: 1, // 当前页数
        size: 20, // 每页显示多少条
      },
      // 页面loading
      loading: false,
      // 筛选项
      filterList: [
        { label: "姓名", inputType: "input", name: "name" },
        { label: "证件号码", inputType: "input", name: "cardId" },
        { label: "电话号码", name: "telPhone", width: "160px" },
        {
          label: "人员类型",
          inputType: "dict",
          name: "personClassify",
          dictName: "person_classify",
        },
      ],
      listBatchAll: [],
      hotelBaseInfoId: "",
      addRules: {
        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
        cardType: [
          { required: true, message: "证件类型不能为空", trigger: "blur" },
        ],
        cardId: [
          { required: true, message: "证件号码不能为空", trigger: "blur" },
          { validator: this.idCardValidate, trigger: "blur" },
        ],
        telPhone: [
          { required: true, message: "手机号不能为空", trigger: "blur" },
          { validator: validatePhone, trigger: "blur" },
        ],
        personClassify: [
          { required: true, message: "人员类型不能为空", trigger: "blur" },
        ],
      },
    };
  },
  computed: {
    // 菜单列表
    menuList() {
      return this.getPermissions("pay_contract_registration_batch_del")
        ? ["add", "delete", "export"]
        : ["add", "export"];
    },

    operaInfo() {
      return ["preview"];
    },

    dataInfo() {
      return [
        {
          label: "隔离点名称",
          prop: "hotelName",
          "show-overflow-tooltip": true,
        },
        { label: "姓名", prop: "name", width: "100px" },
        // {
        //   label: "证件类型",
        //   prop: "cardType",
        //   width: "100px",
        //   formatter: this.dataFormatter,
        //   "show-overflow-tooltip": true,
        // },
        // { label: "证件号码", prop: "cardId", "show-overflow-tooltip": true },
        { label: "电话号码", prop: "telPhone" },
        {
          label: "人员类型",
          prop: "personClassify",
          formatter: this.dataFormatter,
          "show-overflow-tooltip": true,
        },
        {
          label: "人员状态",
          prop: "personState",
          formatter: this.dataFormatter,
        },
        {
          label: "心里评估等级",
          prop: "assessmentRiskLevel",
        },
        {
          label: "是否关爱人员",
          prop: "sign",
          formatter: this.dataFormatter,
        },
      ];
    },
  },
  methods: {
    handleMenuClick() {
      this.$refs.dialog.changeVisible();
    },
    //格式化表格字典值
    dataFormatter(row, column, cellValue) {
      console.log(column);
      switch (column.property) {
        case "cardType":
          return extractName("card_type", row.cardType);
        case "personState":
          return extractName("person_state", row.personState);
        case "personClassify":
          return extractName("person_classify", row.personClassify);
        case "sign":
          return row.sign == 1 ? "是" : "否";
        default:
          break;
      }
    },
    addInfo() {
      this.$refs.dialog.changeVisible();
    },

    formItemChang() {
      if (this.$refs.dialog.formData.personClassify === "7") {
        this.popUpdata.push({
          label: "备注",
          prop: "remarks",
          key: "remarks",
          type: "input",
        });
      } else {
        if (this.popUpdata.length > 5) {
          this.popUpdata.pop();
        }
      }
    },

    queryData(params = {}) {
      this.loading = true;
      let requestData = {
        ...this.params,
        ...params,
        qt: "none",
        personState: "12",
      };
      getpagequery(requestData)
        .then((res) => {
          const { current, size, total, records } = res.data.data;
          this.tableData = records;
          this.params = requestData;
          this.pager = { total, current, size };
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 菜单点击监听
    //表格按钮点击事件监听
    async handleBtnClick({ type, row = {} }) {
      this.currentMoveInfoId = row.moveInfoId;
      this.currentPersonId = row.personId;
      this.currentHotelBaseInfoId = row.hotelBaseInfoId;
      switch (type) {
        case "preview":
          this.$refs.hotelDialog.show({ type, data: row, isForm: false });
          break;
        case "receive":
          this.$refs.receiveDialog.show({ type, data: row, isForm: true });
          break;
        case "finished":
          this.$confirm(
            "确定完成此预订批次么？完成后将释放此预订批次所有房间",
            "提示",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
          ).then(() => {
            putBookComplete({ bookInfoId: row.bookInfoId }).then((res) => {
              if (res) {
                this.queryData();
                this.$message({
                  type: "success",
                  message: "完成成功!",
                });
              }
            });
          });
        default:
          break;
      }
    },

    addSubmit() {
      const param = {
        ...this.$refs.dialog.formData,
        name: this.$refs.dialog.formData.name.replace(/(^\s*|\s*$)/g, ""),
      };

      savePerson(param).then((res) => {
        if (res) {
          this.$refs.dialog.dialogVisible = false;
          this.$message({
            type: "success",
            message: "新增成功!",
          });

          this.queryData();
        }
      });
    },

    // 验证身份证号
    idCardValidate(rule, value, callback) {
      if (this.$refs.dialog.formData.cardType === "0") {
        validateIdNo(rule, value, callback);
      } else {
        callback();
      }
    },
  },
};
</script>
